﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Avanto.master" AutoEventWireup="true"
    CodeFile="Home.aspx.cs" Inherits="Home" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="Server">
</asp:Content> 
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <script src="JS/jquery.cookie.js" type="text/javascript"></script>
    <script type="text/javascript">

        function deleteAllCookies() {
            var cookies = document.cookie.split(";");

            for (var i = 0; i < cookies.length; i++) {
                var cookie = cookies[i];
                var eqPos = cookie.indexOf("=");
                var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie;
                document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT";
            }
        }

        function clearAndRedirect() {
            deleteAllCookies();
            document.location = Home.aspx;
        }

        function deleteCookie() {

            setCookie('cartCookie', '', -1);

            return false;

        }

    </script>
    <script type="text/javascript">

        function navigate() {

            var query = $("#searchbar").val();

            window.location = "SearchPage.aspx?search=" + query + "";

            return false;

        } 

    </script>
    <script type="text/javascript">

        var count = 0;

        // var cartproduct = new Array();

        function addOrderItem(product) {

            count++;

            $('#addeditems').html(count);

            var item = JSON.stringify(product);
            //alert(item);

            //alert(cartproduct.valueOf());

            var detail = JSON.parse(item);
            $("#total").val(parseFloat($("#total").val()) + parseFloat(detail.Price));
            var imgPath = '<img width="100%" height="100px" src="' + detail.File + '"  />'
            var link = '<a href="#" onclick=window.open("moreDetails.aspx?proid=' + parseFloat(detail.Product) + '")>More Details</a>';
            var removeToCart = '<input class="btn btn-danger" type="submit" value="Remove Item" onclick="return removeOrderItem(' + detail.Product + ',' + detail.Price + ')" />';

            var brk = '<br>';
            //return "<div> " + imgPath + " Brand Name : " + Details[0] + "  Model : " + Details[1] + " Price : " + Details[2] + "" + link + " </div>";

            var addeditem = '<div  id="order' + detail.Product + '"class="gridWrap"> <div class="gridImage" > ' + imgPath + ' </div>  <div class="gridProductInformation" > Product ID : '
                             + detail.Product + brk + ' Brand Name : '
                             + detail.Brand + brk + ' Model : '
                             + detail.Model + brk + ' Price : <span class="price">'
                             + detail.Price + brk + '</span> </div>  <div class="gridLink">' + removeToCart + '  <div class="moreDetails">' + link + ' <div>   </div>';


            $("#cartView").append(addeditem);
            $.cookie("cartCookie", $('#cartView').html());

            $.cookie("count", count);
            //alert($("#total").val());
            $.cookie("total", $("#total").val());

            return false;
        }


        function orderedItems() {

            var orderedlength = $("#cartView .gridWrap").length;
            var orderedProductsID = "";

            for (start = 0; start < orderedlength; start++) {
                orderedProductsID = orderedProductsID + $("#cartView .gridWrap")[start].id.toString().replace('order', '') + ",";
            }

            //alert(orderedProductsID.substring(0, orderedProductsID.length - 1));

            var custorder = orderedProductsID.substring(0, orderedProductsID.length - 1);

            var jData = {};
            jData.customerorder = custorder;
            jData.customername = $('#custname').val();
            jData.customermobile = $('#custmobile').val();
            jData.customeraddress = $('#custaddress').val();
            jData.customercity = $('#custcity').val();
            jData.customerstate = $('#custstate').val();

            $.ajax({
                type: "POST",
                url: "ProductService.svc/saveOrderInformation",
                data: JSON.stringify(jData),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    var Result = eval('(' + response.d + ')');
                    alert(Result["Message"]);
                    alert("Your Order ID is" + Result["Confirmation"] + " Please Make a note of it for further transactions,Your Product will be delivered within 5 working days");
                    // window.location = "NewDashboard.aspx";
                    clearAndRedirect();

                },
                failure: function (msg) {
                    alert(msg);
                },
                error: function (jqXHR, exception) {
                    if (jqXHR.status === 0) {
                        alert('Not connect.\n Verify Network.');
                    } else if (jqXHR.status == 404) {
                        alert('Requested page not found. [404]');
                    } else if (jqXHR.status == 500) {
                        alert('Internal Server Error [500].');
                    } else if (exception === 'parsererror') {
                        alert('Requested JSON parse failed.');
                    } else if (exception === 'timeout') {
                        alert('Time out error.');
                    } else if (exception === 'abort') {
                        alert('Ajax request aborted.');
                    } else {
                        alert('Uncaught Error.\n' + jqXHR.responseText);
                    }
                }

            });

            return false;
        }

        function removeOrderItem(productid, price) {

            $("#total").val(parseFloat($("#total").val()) - parseFloat(price));


            $("#cartView #order" + productid).remove();
            $("#" + productid).remove();
            $.cookie("cartCookie", $('#cartView').html());


            count--;
            // alert(count);


            $.cookie("count", count);
            //alert($("#total").val());
            $.cookie("total", $("#total").val());

            $('#addeditems').html(count);

            return false;
        }


        function getUser() {

            var jData = {};
            jData.UserEmail = $('#email').val();


            $.ajax({
                type: "POST",
                url: "ProductService.svc/getCustomer",
                data: JSON.stringify(jData),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    var Result = eval('(' + response.d + ')');
                    $('#customername').val(Result["CustomerFirstname"]);
                    $('#customermobile').val(Result["CustomerMobile"]);
                    $('#customeraddress').val(Result["CustomerAddress1"]);
                    $('#customercity').val(Result["CustomerAddress2"]);
                    $('#customerstate').val(Result["CustomerState"]);



                },
                failure: function (msg) {
                    alert(msg);
                },
                error: function (jqXHR, exception) {
                    if (jqXHR.status === 0) {
                        alert('Not connect.\n Verify Network.');
                    } else if (jqXHR.status == 404) {
                        alert('Requested page not found. [404]');
                    } else if (jqXHR.status == 500) {
                        alert('Internal Server Error [500].');
                    } else if (exception === 'parsererror') {
                        alert('Requested JSON parse failed.');
                    } else if (exception === 'timeout') {
                        alert('Time out error.');
                    } else if (exception === 'abort') {
                        alert('Ajax request aborted.');
                    } else {
                        alert('Uncaught Error.\n' + jqXHR.responseText);
                    }
                }

            });
            return false;
        }


        function memberOrderedItems() {

            var orderedlength = $("#cartView .gridWrap").length;
            var orderedProductsID = "";

            for (start = 0; start < orderedlength; start++) {
                orderedProductsID = orderedProductsID + $("#cartView .gridWrap")[start].id.toString().replace('order', '') + ",";
            }

            //alert(orderedProductsID.substring(0, orderedProductsID.length - 1));

            var custorder = orderedProductsID.substring(0, orderedProductsID.length - 1);

            var jData = {};
            jData.customerorder = custorder;
            jData.customername = $('#customername').val();
            jData.customermobile = $('#customermobile').val();
            jData.customeraddress = $('#customeraddress').val();
            jData.customercity = $('#customercity').val();
            jData.customerstate = $('#customerstate').val();

            $.ajax({
                type: "POST",
                url: "ProductService.svc/saveOrderInformation",
                data: JSON.stringify(jData),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    var Result = eval('(' + response.d + ')');
                    alert(Result["Message"]);
                    alert("Your Order ID is" + Result["Confirmation"] + " Please Make a note of it for further transactions,Your Product will be delivered within 5 working days");
                    // window.location = "NewDashboard.aspx";
                    $("#cartView").html("");
                    clearAndRedirect();
                    deleteCookie();
                    //window.location = "SearchPage.aspx";
                },
                failure: function (msg) {
                    alert(msg);
                },
                error: function (jqXHR, exception) {
                    if (jqXHR.status === 0) {
                        alert('Not connect.\n Verify Network.');
                    } else if (jqXHR.status == 404) {
                        alert('Requested page not found. [404]');
                    } else if (jqXHR.status == 500) {
                        alert('Internal Server Error [500].');
                    } else if (exception === 'parsererror') {
                        alert('Requested JSON parse failed.');
                    } else if (exception === 'timeout') {
                        alert('Time out error.');
                    } else if (exception === 'abort') {
                        alert('Ajax request aborted.');
                    } else {
                        alert('Uncaught Error.\n' + jqXHR.responseText);
                    }
                }

            });

            return false;

        }

    </script>
    <script type="text/javascript">

        $(document).ready(function () {


            var content = $.cookie("cartCookie");

            if ($.cookie('count') != "" && $.cookie('count') != null) {
                count = $.cookie('count');

                $('#addeditems').html(count);
            }
            if ($.cookie('total') != "" && $.cookie('total') != null) {

                $('#total').val(parseFloat($.cookie('total')));
            }


            $('#cartView').append(content);
            //alert(content);

            var jData = {};
            jData.PriceTo = 5000;
            jData.PriceFrom = 100;


            $.ajax({
                type: "POST",
                url: "ProductService.svc/searchHomeProducts",
                data: JSON.stringify(jData),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (json) {

                    var data = JSON.parse(json.d);

                    for (start = 0; start < data.binding.length; start++) {
                        var jsonProduct = "{Product:'" + data.binding[start].ProductID + "',Brand:'" + data.binding[start].Brand + "',Model:'" + data.binding[start].Model + "',Price:'" + data.binding[start].Price + "',File:'" + data.binding[start].Filepath + "'}"
                        var imgPath = '<img width="125px" height="115px" src="' + data.binding[start].Filepath + '"  />'
                        var link = '<a href="#" onclick=window.open("moreDetails.aspx?proid=' + data.binding[start].ProductID + '")>More Details</a>';
                        var addToCart = '<input class="styled-button-6" type="submit" value="Add To Cart" onclick="return addOrderItem(' + jsonProduct + ')" />';

                        var brk = '<br>';
                        //return "<div> " + imgPath + " Brand Name : " + Details[0] + "  Model : " + Details[1] + " Price : " + Details[2] + "" + link + " </div>";

                        var newitem = '<div class="item"> <div class="product-image" > ' + imgPath + ' </div> <div class="product-name" > Product ID : '
                             + data.binding[start].ProductID + brk + ' </div> <div class="product-name"> Brand Name : '
                             + data.binding[start].Brand + brk + ' </div> <div class="product-name"> Model : '
                             + data.binding[start].Model + brk + ' </div> <div class="product-name"> Price : <span class="price"><span class="symbol">$</span>'
                             + data.binding[start].Price + brk + ' </span> </div>  <div class="product-name">' + addToCart + ' <div class="product-name">' + link + '<div> <div>   </div>';

                        $("#Div1").append(newitem);


                    }
                },
                failure: function (msg) {
                    alert(msg);
                },
                error: function (jqXHR, exception) {
                    if (jqXHR.status === 0) {
                        alert('Not connect.\n Verify Network.');
                    } else if (jqXHR.status == 404) {
                        alert('Requested page not found. [404]');
                    } else if (jqXHR.status == 500) {
                        alert('Internal Server Error [500].');
                    } else if (exception === 'parsererror') {
                        alert('Requested JSON parse failed.');
                    } else if (exception === 'timeout') {
                        alert('Time out error.');
                    } else if (exception === 'abort') {
                        alert('Ajax request aborted.');
                    } else {
                        alert('Uncaught Error.\n' + jqXHR.responseText);
                    }
                }
            });

//            $(document).ready(function () {

//                if ($.cookie() != null) {
//                    alert(""Values present");
//                }
//            });

            $.ajax({
                type: "POST",
                url: "ProductService.svc/latestProducts",
                data: JSON.stringify(jData),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (json) {

                    var data = JSON.parse(json.d);

                    for (start = 0; start < data.binding.length; start++) {
                        var jsonProduct = "{Product:'" + data.binding[start].ProductID + "',Brand:'" + data.binding[start].Brand + "',Model:'" + data.binding[start].Model + "',Price:'" + data.binding[start].Price + "',File:'" + data.binding[start].Filepath + "'}"
                        var imgPath = '<img width="125px" height="115px" src="' + data.binding[start].Filepath + '"  />'
                        var link = '<a href="#" onclick=window.open("moreDetails.aspx?proid=' + data.binding[start].ProductID + '")>More Details</a>';
                        var addToCart = '<input class="styled-button-6" type="submit" value="Add To Cart" onclick="return addOrderItem(' + jsonProduct + ')" />';

                        var brk = '<br>';
                        //return "<div> " + imgPath + " Brand Name : " + Details[0] + "  Model : " + Details[1] + " Price : " + Details[2] + "" + link + " </div>";

                        var newitem = '<div class="item"> <div class="product-image" > ' + imgPath + ' </div> <div class="product-name" > Product ID : '
                             + data.binding[start].ProductID + brk + ' </div> <div class="product-name"> Brand Name : '
                             + data.binding[start].Brand + brk + ' </div> <div class="product-name"> Model : '
                             + data.binding[start].Model + brk + ' </div> <div class="product-name"> Price : <span class="price"><span class="symbol">$</span>'
                             + data.binding[start].Price + brk + ' </span> </div>  <div class="product-name">' + addToCart + ' <div class="product-name">' + link + '<div> <div>   </div>';

                        $("#Div2").append(newitem);


                    }
                },
                failure: function (msg) {
                    alert(msg);
                },
                error: function (jqXHR, exception) {
                    if (jqXHR.status === 0) {
                        alert('Not connect.\n Verify Network.');
                    } else if (jqXHR.status == 404) {
                        alert('Requested page not found. [404]');
                    } else if (jqXHR.status == 500) {
                        alert('Internal Server Error [500].');
                    } else if (exception === 'parsererror') {
                        alert('Requested JSON parse failed.');
                    } else if (exception === 'timeout') {
                        alert('Time out error.');
                    } else if (exception === 'abort') {
                        alert('Ajax request aborted.');
                    } else {
                        alert('Uncaught Error.\n' + jqXHR.responseText);
                    }
                }
            });


            //alert(param);
        });


       

    </script>
    <div class="home_page_header_block">
        <div id="slider">
            <div id="mask">
                <ul>
                    <li id="first" class="firstanimation"><a href="#">
                        <img src="IMAGE/1.jpg" style="width: 107%" alt="" />
                    </a></li>
                    <li id="second" class="secondanimation"><a href="#">
                        <img src="IMAGE/2.jpg" style="width: 107%" alt="" />
                    </a></li>
                    <li id="third" class="thirdanimation"><a href="#">
                        <img src="IMAGE/3.jpg" style="width: 107%" alt="" />
                    </a></li>
                    <li id="fourth" class="fourthanimation"><a href="#">
                        <img src="IMAGE/2.jpg" style="width: 107%" alt="" />
                    </a></li>
                    <li id="fifth" class="fifthanimation"><a href="#">
                        <img src="IMAGE/3.jpg" style="width: 107%" alt="" />
                    </a></li>
                </ul>
            </div>
            <div class="progress-bar">
            </div>
        </div>
        <div class="main-container col3-layout">
            <div class="main">
                <div class="col-wrapper">
                    <div class="col-main">
                        <div class="std">
                            <div>
                                <div id="category-products">
                                    <div id="Div1" style="float: left;">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-left sidebar">
                        <div class="block block-cart">
                            <div class="block-title">
                                <strong><span>My Cart</span></strong>
                            </div>
                            <div class="block-content">
                                <div class="summary">
                                    <p class="amount">
                                        <a href="#"></a>
                                    </p>
                                    <p class="subtotal">
                                        <span class="label"></span><span class="price"></span>
                                    </p>
                                </div>
                                <p class="block-subtitle">
                                    Total added item(s) in Cart</p>
                                <span id="addeditems">0</span><span> x items</span><br />
                                <br />
                                <a data-reveal-id="myModal" href="#">
                                    <img src="IMAGE/images/checkout.gif"></a>
                                <%--<input type='button' name='osx' value='Check Out' class='osx demo'/>--%>
                                <%--<ol id="cart-sidebar" class="mini-products-list">
                                    <li class="item last odd"><a href="#" title="Sony BRAVIA KDL32BX320 32-Inch 720p LCD HDTV, Black"
                                        class="product-image">
                                        <img src="avantoClassic/images/2338351YSN7GguqL.jpg" alt="Sony BRAVIA KDL32BX320 32-Inch 720p LCD HDTV, Black"
                                            height="50" width="50"></a>
                                        <div class="product-details">
                                            <a href="#" title="Remove This Item" onclick="return confirm('Are you sure you would like to remove this item from the shopping cart?');"
                                                class="btn-remove">Remove This Item</a>
                                            <p class="product-name">
                                                <a href="#">Sony BRAVIA KDL32BX320 32-Inch 720p LCD HDTV, Black</a></p>
                                            <strong>1</strong> x <span class="price">$335.99</span>
                                        </div>
                                    </li>
                                </ol>--%>
                                <script type="text/javascript">                                    decorateList('cart-sidebar', 'none-recursive')</script>
                            </div>
                        </div>
                        <div style="width: 193px; overflow: hidden; border: 1px solid #D9DDE3;">
                        </div>
                        <div>
                        </div>
                    </div>
                </div>
                <div class="col-right sidebar">
                    <div class="block">
                        <div class="block-title">
                            <strong><span>Latest products</span></strong></div>
                        <div class="block-content download">
                            <div id="category-products">
                                <div id="Div2">
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--end download banner  -->
                    <!--magento hosting banner start -->
                    <div class="block">
                        <div class="block-title">
                            <strong>Kaizen<span> Hosting</span></strong></div>
                        <div class="block-content download">
                            <p>
                                <a title="Get Free Magento Hosting" href="#">
                                    <img src="#" alt="Magento Shared Hosting">
                                </a>
                            </p>
                        </div>
                    </div>
                    <!--end magento hosting banner  -->
                    <div class="block customer_service">
                        <div class="block-title">
                            <strong><span>Customer service</span></strong></div>
                        <div class="block-content">
                            <p class="phone">
                                +91 9881234321</p>
                            <p class="time">
                                9.00-19.00 Mon-Fri</p>
                        </div>
                    </div>
                    <script type="text/javascript">
//<![CDATA[
                        function validatePollAnswerIsSelected() {
                            var options = $$('input.poll_vote');
                            for (i in options) {
                                if (options[i].checked == true) {
                                    return true;
                                }
                            }
                            return false;
                        }
//]]>
                    </script>
                </div>
            </div>
        </div>
    </div>
    <div style="top: 100px; opacity: 1; visibility: hidden;" id="myModal" class="reveal-modal">
        <div>
            <label>
                Total</label><input type="text" id="total" disabled="disabled" value="0" />
            <table id="cartView">
            </table>
            <input type="button" value="Order" onclick="$('#choice').show()" />
            <div id="choice" style="display: none">
                <fieldset>
                    <div class="some-class">
                        <%-- <form action="">
                    <input type="radio" name="user" value="Registered" onclick="$('#registered').show();$('#orderconfirm').hide();">Already
                    Registered<br>
                    <input type="radio" name="user" value="New" onclick="$('#orderconfirm').show();$('#registered').hide();">New
                    User
                    </form>--%>
                        <input type="radio" class="" name="user" value="Registered" id="" onclick="$('#registered').show();$('#orderconfirm').hide();" />
                        <label for="y">
                            Already Registered</label>
                        <input type="radio" style="margin-left: 20px;" class="" name="user" value="New" id=""
                            onclick="$('#orderconfirm').show();$('#registered').hide();" />
                        <label for="z">
                            New User</label>
                    </div>
                </fieldset>
            </div>
            <div id="registered" style="display: none">
                <div class="divrow">
                    <div class="divlbl">
                        <label id="lblname">
                            Email</label>
                    </div>
                    <input class="textfield" type="text" id="email" />
                    <input type="button" value="Proceed" onclick="return getUser();" />
                </div>
                <div id="customerDetails">
                    <div class="divrow">
                        <div class="divlbl">
                            <label id="lblname">
                                Customer Name</label>
                        </div>
                        <input class="textfield" type="text" id="customername" />
                    </div>
                    <div class="divrow">
                        <div class="divlbl">
                            <label id="lblname">
                                Customer Mobile</label>
                        </div>
                        <input class="textfield" type="text" id="customermobile" />
                    </div>
                    <div class="divrow">
                        <div class="divlbl">
                            <label id="lblname">
                                Customer Address</label>
                        </div>
                        <input class="textfield" type="text" id="customeraddress" />
                    </div>
                    <div class="divrow">
                        <div class="divlbl">
                            <label id="lblname">
                                Customer City</label>
                        </div>
                        <input class="textfield" type="text" id="customercity" />
                    </div>
                    <div class="divrow">
                        <div class="divlbl">
                            <label id="lblname">
                                Customer State</label>
                        </div>
                        <input class="textfield" type="text" id="customerstate" />
                    </div>
                </div>
                <input type="button" value="Confirm Order" onclick="return memberOrderedItems()"
                    class="simplemodal-close" />
            </div>
            <div id="orderconfirm" style="display: none">
                <div class="divrow">
                    <div class="divlbl">
                        <label id="lblname">
                            Customer Name</label>
                    </div>
                    <input class="textfield" type="text" id="custname" />
                </div>
                <div class="divrow">
                    <div class="divlbl">
                        <label id="lblname">
                            Customer Mobile</label>
                    </div>
                    <input class="textfield" type="text" id="custmobile" />
                </div>
                <div class="divrow">
                    <div class="divlbl">
                        <label id="lblname">
                            Customer Address</label>
                    </div>
                    <input class="textfield" type="text" id="custaddress" />
                </div>
                <div class="divrow">
                    <div class="divlbl">
                        <label id="lblname">
                            Customer City</label>
                    </div>
                    <input class="textfield" type="text" id="custcity" />
                </div>
                <div class="divrow">
                    <div class="divlbl">
                        <label id="lblname">
                            Customer State</label>
                    </div>
                    <input class="textfield" type="text" id="custstate" />
                </div>
                <input type="button" value="Confirm Order" onclick="return orderedItems()" class="simplemodal-close" />
            </div>
            <%--   <div id="cartPage" class="scroll" style="text-align: center;">
                                </div>
                <input type="button" id="LoadData" value="Show Cart" />--%>
        </div>
        <a class="close-reveal-modal">×</a>
    </div>
    <script type="text/javascript">
<!--
        var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2");
        var MenuBar3 = new Spry.Widget.MenuBar("MenuBar3");
//-->
    </script>
</asp:Content>
